<template>
	<view class="detail-page">
		<view class="detail-img">
			<image class="prod-img" :src="detail.pictureUrl" mode="aspectFit"></image>
		</view>
		<view class="detail-title">
			<view class="title"><text>" </text> {{detail.worksName}}<text> "</text></view>
			<view class="auth">{{detail.attest}}</view>
		</view>
		<view class="detail-info">
			<view class="info-title">
				<view class="left-line"></view>
				<view class="text">产品参数</view>
				<view class="right-line"></view>
			</view>
			<view class="info-item">
				<view class="item-label">所属系列</view>
				<view class="item-value">{{ detail.worksName }}</view>
			</view>
			<view class="info-item">
				<view class="item-label">编号</view>
				<view class="item-value">#{{ detail.worksNum }}</view>
			</view>
			<view class="info-item">
				<view class="item-label">合约地址</view>
				<view class="item-value">{{ setStringStyle(detail.contractAddress) }}</view>
			</view>
			<view class="info-item">
				<view class="item-label">链上标识</view>
				<view class="item-value">{{detail.contractCode}}</view>
			</view>
		</view>
		<view class="detail-desc">
			<view class="desc-img"></view>
			<view class="desc-title">作品权益</view>
			<view class="desc-quanyi" v-html="detail.interests"></view>
			<view class="desc-title-no">作品权益</view>
			<view class="desc-quanyi">{{ detail.describe }}</view>
		</view>
		<view class="detail-bay">
			<button type="default" @click="$tool.navigateTo('/pages/mine/mine')">返回上一页</button>
		</view>
	</view>
</template>

<script>
	import {
		setStringStyle
	} from '../../utils/utils.js'
	import {
		getWorksDetails
	} from '../../request/prod-api.js'
	export default {
		data() {
			return {
				detail: {},
				setStringStyle,
			}
		},
		onLoad(option) {
			this.onloadDetail(option.id)
		},
		methods: {
			// 加载产品详情
			async onloadDetail(id) {
				try {
					let {
						code,
						message,
						data
					} = await getWorksDetails(id)
					if (code === 200) {
						this.detail = data
					} else {
						uni.showToast({
							title: message,
							icon: 'error'
						})
					}
				} catch(err) {
					this.$tool.showErr(err)
				}
			}
		}
	}
</script>

<style scoped lang="scss">
	@import '../../static/css/detail.scss';
</style>
